<template>
  <div id="introduction" :style="{marginTop}">
      <div class="container-fluid banner">
        <div class="row">
          <div class="box">
            <img src="/static/img/intr-banner.png">
            <dl>
              <dt><h1>汽化无焦油&emsp;中国火尔赤</h1></dt>
              <dd>科技引领未来&emsp;为世界输出最清洁能源</dd>
            </dl>
          </div>
        </div>
      </div>

      <div class="container main1">
        <div class="row">
          <dl class="tit-box">
            <dt>企业实力</dt>
            <dd>Enterprise strength</dd>
          </dl>
        </div>
        <div class="row info">
          <div class="col-md-6 left">
            <p>专业从事“全自动无焦油气化发电技术”的研究，该技术是全国唯一独有的 高新技术，具有国际领先水平，目前已申请政府补</p>
            <p class="grey">火尔赤清洁能源是以生物质秸秆无焦油气化清洁利用成套技术为依托、致力于生物质 气化热电联产项目投资的平台公司，公司对外以投资、管理、服务形成产业链，将以投资、 管理和服务为主营业务，做大做实火尔赤公司，并期待在3-5年内实现上市。</p>
            <div class="img-box">
              <img class="col-md-4" src="/static/img/tu1.png" alt="">
              <img class="col-md-4" src="/static/img/tu2.png" alt="">
              <img class="col-md-4" src="/static/img/tu3.png" alt="">
            </div>
          </div>
          <div class="col-md-6 right">
            <img src="/static/img/intr-page1.png">
          </div>
        </div>
        <div class="row jiazhiguan">
          <dl class="tit-box">
            <dt>使命和价值观</dt>
            <dd>Vision and Mission</dd>
          </dl>
        </div>
        <div class="row typebox" style="">
          <dl class="col-md-4 img-text">
            <dt><img src="/static/img/intr-page22.png"></dt>
            <dd class="title">企业愿景</dd>
            <dd class="text">致力于为国家清洁能源综合利用提供最先进的技 术、最先进的经营管理理念、最先进的发展模式 的服务商，成为引领生物质清洁领域的领导者和开拓者</dd>
          </dl>
          <dl class="col-md-4 img-text">
            <dt><img src="/static/img/shiming.png"></dt>
            <dd class="title">企业使命</dd>
            <dd class="text">10年内彻底解决全国范围内的秸秆污染问题 让全中国老百姓在秸秆产业中获利受益 </dd>
          </dl>
          <dl class="col-md-4 img-text">
            <dt><img src="/static/img/intr-page21.png"></dt>
            <dd class="title">核心价值观</dd>
            <dd class="text">我们追求员工成才、品牌成长、公司发展的和谐 统一；明确了创新与人的智慧才是企业的核心竞 争力；通过把团队成员锻造成态度积极、技能优 秀的卓越员工，实现品牌和常青基业的共同理想</dd>
          </dl>
        </div>
      </div>

      <div class="container-fluid map">
        <div class="row">
          <dl class="tit-box">
            <dt>企业发展历程</dt>
            <dd>Enterprise strength</dd>
          </dl>
        </div>
        <div class="row">
          <div class="img-box">
            <img src="/static/img/map00.png">
          </div>
        </div>
      </div>
  </div>
</template>

<script>
	export default {
		name: "Introduction",
		data () {
      return {
        marginTop: "initial"
      }
    },
    mounted () {
      this.marginTop = this.$router.headerH;
    }

	}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only hidden-sm-->
<style scoped lang="scss">
  #introduction{
  }
  .banner{
    .row{
      .box{
        position: relative;
        img{
          width: 100%;
        }
        dl{
          color: #fefefe;
          position: absolute;
          top: 10vw;
          width: 100%;
          text-align: center;
          opacity: .9;
          dt{
            h1{
              font-size: 4.3vw;
              font-weight: bold;
            }
          }
          dd{
            font-size: 1.3vw;
            margin-top: .5vw;
          }
        }
      }
    }
  }

  .main1{
    margin-top: 4vw;
    .row{
      p{
        text-align: left;
        text-indent: 2em;
        line-height: 2em;
        &.grey{
          color: #6a6a6a;
          margin-top: 2vw;
          margin-bottom: 3.5vw;
        }
      }
      .img-box{
        img{
          margin-bottom: 15px;
          padding-left: 0;

        }
      }
      .tit-box{
        dt{
          font-size: 3vw;
          font-weight: normal;
        }
      }
    }
    .info{
      margin-top: 5vw;
      .right{
        img{
          width: 100%;
        }
      }
    }
    .jiazhiguan{
      margin-top: 4.5vw;
    }
    .typebox{
      width: 100%;
      margin-top: 4vw;
      dl.img-text{
        dt{
          margin-bottom: 16px;
          height: 98px;
          line-height: 98px;
        }
        dd{
          padding-bottom: 20px;
          color: #6a6a6a;
        }

      }
    }
  }

  .map{
    background: #f9f9f9;
    padding-top: 48px;
    padding-bottom: 65px;
      .row{
        .tit-box{
          dt{
            font-size: 3vw;
            font-weight: normal;
          }
        }
        .img-box{
          margin-top: 4.5vw;
          img{
            width: 80%;
          }
        }
      }
    }
</style>
